{literal}


<script type="text/javascript">
$(document).ready(
		function() {
			$('#fechaDesde').datepicker({
				  format: "dd/mm/yyyy",
				    language: "es",
				    autoclose: true,
				    todayHighlight: true
			});
			$('#fechaHasta').datepicker({
				  format: "dd/mm/yyyy",
				    language: "es",
				    autoclose: true,
				    todayHighlight: true
			});
			var date = new Date();
			var firstDay = new Date(date.getFullYear(), date.getMonth(), 1);
			var lastDay = new Date(date.getFullYear(), date.getMonth() + 1, 0);

			$('#fechaDesde').val(app.utils.Date.toChar( firstDay, 'dd/m/yyyy' ));
			$('#fechaHasta').val(app.utils.Date.toChar( lastDay, 'dd/m/yyyy' ));
			function runningFormatter(value, row, index) {
			    return index;
			}
			$("#buscarBtn").click(
					function() {

						var fechaDesde = $("#fechaDesde").val();
						var fechaHasta = $("#fechaHasta").val();

						// Returns successful data submission message when the entered information is stored in database.
						var dataString = 'reportes.php?operacion=porFechas&fechaDesde=' + fechaDesde + '&fechaHasta='
								+ fechaHasta;
						console.log(dataString);
						
						$.ajax({
							type : "GET",
							url : dataString,
							cache : false,
							success : function(result) {
								var dataJson = jQuery.parseJSON( result );
								$('#tablaa').bootstrapTable({
				                   data:dataJson[0] 
				                });
//  								console.log(JSON.stringify(dataJson[0]));
								$('#tablaa').bootstrapTable('load',dataJson[0]);
								$("#totalLabel").html("Total:");
								$("#totalSpan").html("$" + dataJson[1]);
							}
							});
					});

			});



</script>

{/literal}



		<form class="form-inline" role="form">
		<legend>Reporte de cargas por fecha</legend>
			<div class="form-group">
				<label for="fechaDesde">Fecha desde</label> <input type="text"
					type="text" class="form-control" id="fechaDesde"
					placeholder="Seleccione una fecha">
			</div>
			<div class="form-group" style="margin-left: 10px;">
				<label>Fecha Hasta</label> <input type="text" type="text"
					class="form-control" id="fechaHasta"
					placeholder="Seleccione una fecha">
			</div>
			<button type="button" class="btn btn-primary" id="buscarBtn">Buscar</button>
		</form>
		
		<div style="height: 65%; margin-top: 30px;">


<!--  data-url="reportes.php?operacion=porFechas&fechaDesde=01/06/2015&fechaHasta=16/06/2015" -->
<table id="tablaa" class="table table-striped" data-height="350" data-show-refresh="true"
       data-show-toggle="true"
       data-show-columns="true"
       data-search="true">
    <thead>
        <tr>
<!--         	<th data-formatter="runningFormatter"></th> -->
            <th data-field="usuario" data-sortable="true">Usuario</th>
            <th data-field="creditos" data-sortable="true" >Creditos</th>
            <th data-field="fechaCarga" data-sortable="true">Fecha de carga</th>
            <th data-field="precio" data-sortable="true">Precio</th>
        </tr>
    </thead>
</table>
<h3 style="text-align: right;"><span id="totalLabel"> </span><span class="label label-primary" id="totalSpan"></span></h3>
</div>



